<template>
    <div class="attachmentType main_Body">
        <cusTable @onSubmit="onSubmit" :hasSearch="false" :tableClass="tableClass" :total="pages.total"
            v-if="is_change_data"
            :tableData="tableData.slice((this.pages.pageIndex - 1) * this.pages.pageSize, (this.pages.pageIndex - 1) * this.pages.pageSize + this.pages.pageSize)"
            :formData="formData" :operate="false">

            <template v-slot:type="scope">
                <div class="flex-between">
                    <el-tag v-if="scope.data.children && scope.data.children.length > 0">一级名称</el-tag>
                    <el-tag v-else type="success">二级名称</el-tag>
                </div>
            </template>
        </cusTable>

        <editModal v-model="editShow" :id="id" @submitAfter="submitAfter" />
    </div>
</template>

<script>
import cusTable from "@/components/cus-table/index.vue";
import editModal from "./modal/editModal.vue";
import { menuManagementData } from "@/plugins/tableData";

const YesNoConst = [
  {
    label: '是',
    value: '1',
  },
  {
    label: '否',
    value: '0',
  },
];

export const IsHaveConst = [
  {
    label: '有',
    value: '1',
  },
  {
    label: '无',
    value: '0',
  },
];
export default {
    name: "authorityManagement",
    components: {
        cusTable,
        editModal
    },
    data() {
        return {
            is_change_data: false,
            searchFrom: [
                {
                    label: '权限名称',
                    value: 'name',
                    placeholder: '请输入',
                    type: 'input',
                }
            ],
            tableData: [],
            formData: {
                name: '',
            },
            YesNoConst,
            tableClass: [
                {
                    prop: 'id',
                    label: `权限ID`,
                },
                {
                    prop: 'name',
                    label: `权限名称`,
                },
                {
                    prop: 'description',
                    label: '权限说明',
                },
                {
                    prop: 'type',
                    label: '权限类型',
                },
            ],
            editShow: false,
            removeShow: false,
            id: null,
            pages: {
                pageIndex: 1,
                pageSize: 10,
                total: 0,
            },
        }
    },
    computed: {
        userInfo() {
            return this.$store.state.userInfo
        },
        employeeInfo() {
            return this.$store.state.employeeInfo
        },
    },
    watch: {},

    methods: {

        async getData(searchFrom) {
            // if (searchFrom) {


            // }else{
            this.tableData = []
            const res = await this.$axios.post('/graphql', {
                query: `{
                roleQueryRepository {
                    getRoles(organId: "${this.employeeInfo.organization.id}") {
                    id
                    name
                    description
                    department {
                        id
                        removed
                        name
                        }
                        getPermissions {
                    id
                    action
                    description
                    resource
                    }
                    getHolders {
                        id
                        name
                        pinyin
                        phoneNumber
                        officialRank
                        isMale
                        }
                    }
                }
                }`
            });
            if (!res.data.errors) {
                let handleRes = res.data.data.roleQueryRepository.getRoles;
                handleRes.forEach((item, index) => {
                    item.index = `index${index + 1}`
                    item.children = item.getPermissions.map((aItem, aIndex) => {
                        return {
                            index: `index${index + 1}${aIndex + 1}`,
                            name: aItem.action,
                            ...aItem
                        }
                    })
                    delete item.getPermissions;
                })

                this.is_change_data = true;
                // return
                this.tableData = [...handleRes];
                // this.pages.total = this.tableData.length;
            }
            if (searchFrom) {
                let newTableData = this.tableData.filter(val => val.name.includes(searchFrom.name));
                this.tableData = newTableData.map(item => {
                    return {
                        ...item,
                    }
                })

            }
            this.pages.total = this.tableData.length;


        },
        edit(id) {
            this.editShow = true;
            this.id = id ?? null;
        },
        remove(data) {
            this.tableData = menuManagementData.filter(val => val.id != data.id)
        },
        onSubmit(data) {
            if (data) {
                this.pages.pageIndex = data.page;
                this.pages.pageSize = data.size;
                this.getData(data.formData);
            }
        },
        submitAfter(status) {
            // 数据保存后触发的函数
            if (status) {
                // 刷新列表数据
                this.getData();
            }
        }
    },
    created() {
        this.getData();
    },
    activated() {
        this.getData();
    },
}

</script>

<style lang="scss">
.attachmentType {
    .action {
        .el-button {
            margin-right: 16px;
        }
    }
}
</style>
